import { Component, OnInit, AfterViewChecked, ViewChild, Input } from '@angular/core';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { ConfirmationService } from 'primeng/primeng';
import { MdlSnackbarService } from '@angular-mdl/core';
import { Location } from '@angular/common';
import { RoleService } from './service/role.service';
import { flyIn } from '../../common/animation/common.animation';
@Component({
  selector: 'role-detail',
  templateUrl: './role-detail.component.html',
  styleUrls: ['./role-detail.component.scss'],
  animations: [flyIn]
})
export class RoleDetailComponent implements OnInit {
  roleItem: any = {'roleAvatar':'5'};
  roleForm: FormGroup;
  roleAvatarIcons: string[] = new Array('2', '3', '4', '5', '6');//, '7', '8', '9'
  @Input()
  set role(role: any) {
    if (!role) return;
    this.roleItem = role;
    this.buildForm()
  }

  get role(): any { return this.roleItem; }

  constructor(
    private roleService: RoleService,
    private fb: FormBuilder,
    private location: Location,
    private mdlSnackbarService: MdlSnackbarService,
    private confirmationService: ConfirmationService) { }

  ngOnInit(): void {
    this.buildForm();
  }
  /**保存或更新岗位信息 */
  saveUpdate() {
    let value = this.roleForm.value;
    value['templateFlag'] = value['templateFlag'] ? 1 : 0;
    this.roleService.saveUpdateRole(value)
      .subscribe(data => {
        this.mdlSnackbarService.showToast('数据保存成功！');
        this.roleService.announceMission(data);
      });
  }
  /** 删除岗位信息 */
  delete() {
    this.confirmationService.confirm({
      header: '确认',
      message: '您确定要删除该条记录吗？',
      accept: () => {
        this.roleService.delete(this.roleItem.roleId).subscribe(data => {
          this.roleService.announceMission(this.roleItem);
          this.mdlSnackbarService.showToast('数据删除成功！');
        });
      }
    });
  }
  buildForm(): void {
    this.roleForm = this.fb.group({
      'roleId': [this.roleItem.roleId],
      'roleName': [this.roleItem.roleName, [
        Validators.required,
        Validators.minLength(4),
        Validators.maxLength(24)
      ]
      ],
      'roleCode': [this.roleItem.roleCode],
      'roleAvatar':[this.roleItem.roleAvatar],
      'unitName': [this.roleItem.unitName, Validators.required],
      'unitCode': [this.roleItem.unitCode],
      'templateFlag': [this.roleItem.templateFlag],
      'unitId': [this.roleItem.unitId, Validators.required],
      'createTime': [this.roleItem.createTime],
      'displayOrder': [this.roleItem.displayOrder],
      'roleDesc': [this.roleItem.roleDesc]
    });

    this.roleForm.valueChanges
      .subscribe(data => this.onValueChanged(data));

    this.onValueChanged();
  }

  onValueChanged(data?: any) {
    if (!this.roleForm) { return; }
    const form = this.roleForm;

    for (const field in this.formErrors) {
      this.formErrors[field] = '';
      const control = form.get(field);

      if (control && control.dirty && !control.valid) {
        const messages = this.validationMessages[field];
        for (const key in control.errors) {
          this.formErrors[field] += messages[key] + ' ';
        }
      }
    }
  }

  /**返回操作 */
  goBack($event: any) {
    if (this.roleForm.dirty) {
      this.confirmationService.confirm({
        header: '确认',
        message: '您确定要放弃保存修改的记录吗？',
        accept: () => {
          this.location.back();
        }
      });
    } else {
      this.location.back();
    }
  }

  formErrors = {
    'name': '',
    'code': '',
    'value': '',
    'description': ''
  };


  validationMessages = {
    'name': {
      'required': 'Name is required.',
      'minlength': 'Name must be at least 4 characters long.',
      'maxlength': 'Name cannot be more than 24 characters long.'
    },
    'code': {
      'required': 'Code is required.',
      'minlength': 'Code must be at least 4 characters long.',
      'maxlength': 'Code cannot be more than 24 characters long.'
    },
    'value': {
      'required': 'Power is required.'
    },
    'description': {
      'required': 'Power is required.'
    }
  };

}
